<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Cloudy | Content</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
    $(function() {
        $( "#accordion" ).accordion();
    });
    
    $(function() {
        $( "input[type=submit], a, button" )
            .buttons()
            .click(function( event ) {
                event.preventDefault();
            });
    });
</script>
    
</head>
<%@ include file="template/headerContent.jsp" %>
<body>     
        	<div class="full_width">
        	<center>
            <textarea rows="6" cols="75" style="padding: 5px">What do you want to share?</textarea><br/><br/>
	    			<div id="buttons_top">
	    				<table>
	    					<tr>
	    						<td><div class="button_01"><a href="#">Image</a></div></td>
	    						<td><div class="button_01"><a href="#">Video</a></div></td>
	    						<td><div class="button_01"><a href="#">Post</a></div></td>
	    					</tr>
	    				</table>
    				</div>
            </center>
            <br>
            <div id="accordion">
			<h3><img src="template/images/tumblr_ldjke2cEQn1qe7bsyo1_500.jpg" height="50" width="50" />
		   		<u>Jesse_129</u> just posted "How to prepare a healthy breakfast for your loved ones."</h3>
		   			<div>
			        	<p>
			       	 	Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
			      	  	ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
			      	  	amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
			        	odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
			        	</p>
			        	<br>
			        <div id="buttons"><img src="template/images/clean-social-circles.jpg" class="float_r"></div>
			        <br>
			    	</div>
			    	
			<h3><img src="template/images/tumblr_ldt10pqPL21qc4lz2o1_500.jpg" height="50" width="50">
				<u>RenChi</u> just posted "Hello"</h3>
			    	<div>
			        	<p>
			        	Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
			        	purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
			        	velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
			        	suscipit faucibus urna.
			        	</p>
			        	<br>
			        <div id="buttons"><img src="template/images/clean-social-circles.jpg" class="float_r"></div>
			        <br>
			    	</div>
			<h3><img src="template/images/tumblr_le1rs6wKeb1qeght2o1_500_large.jpg" height="50" width="50">
				<u>xmsoks</u> just posted "Fun health facts"</h3>
			    	<div>
			        	<p>
			        	Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
			        	Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
			        	ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
			        	lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
			        	</p>
			        	<ul>
			            	<li>List item one</li>
			            	<li>List item two</li>
			            	<li>List item three</li>
			        	</ul>
			        	<br>
			        <div id="buttons"><img src="template/images/clean-social-circles.jpg" class="float_r"></div>
			        <br>
			    </div>
			    
			<h3><img src="template/images/tumblr_ldjke2cEQn1qe7bsyo1_500.jpg" height="50" width="50">
		   		<u>Jesse_129</u> just posted "Video for working out"</h3><div>
			    	<p>
			        Cras dictum. Pellentesque habitant morbi tristique senectus et netus
			        et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
			        faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
			        mauris vel est.
			        </p>
			        <p>
			        Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
			        Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
			        inceptos himenaeos.
			        </p>
			        <br>
			        <div id="buttons"><img src="template/images/clean-social-circles.jpg" class="float_r"></div>
			        <br>
			    </div>
			</div>
			
            	<!-- Do not remove the BR unless your content is long -->
                <br><br><br><br><br><br>
                <div class="cleaner"></div>
            </div>

<%@ include file="template/footerContent.jsp" %>
</body>
</html>